<template>
	<!-- 保养工单 添加/编辑 -->
	<div class="compile">
		<el-dialog :close-on-click-modal='false' :append-to-body='true' :before-close='close' :close-on-press-escape='false'
		 :title="title" :visible.sync="addAndCompileShow">
			<el-form :model="form" :rules="rules" ref="form" v-loading='isLoading'>
				<el-row>
					<div class="textLeft titleMessNow">工单信息</div>
				</el-row>
				<el-row>
					<el-col :span="15" :offset='1'>
						<el-form-item label="使用单位:" :label-width="formLabelWidth" prop="userUnit">
							<el-select :disabled="isAddOrComp==2" size="mini" @change='selectChange' @focus="getUserUnit" :remote-method="findUserUnit"
							 filterable remote v-model="form.userUnit" placeholder="请选择使用单位" clearable>
								<el-option v-for="item in userUnitArr" :value="item.id" :label="item.label" :key='item.id'>
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="15" :offset='1'>
						<el-form-item label="维保电梯:" :label-width="formLabelWidth" prop="choseLift">
							<el-select size="mini" multiple :disabled="disableLift || isAddOrComp==2" v-model="form.choseLift" :placeholder="liftMess"
							 filterable :filter-method="dataFilter" clearable>
								<el-option v-for="item in liftNewArr" :value="item.elevator_id" :label="item.register_code" :key='item.elevator_id'>
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row v-if="isAddOrComp==2">
					<el-col :span="15" :offset='1'>
						<el-form-item label="维保类型:" :label-width="formLabelWidth" prop="mainType">
							<el-select size="mini" v-model="form.mainType" placeholder="请选择维保类型" clearable>
								<el-option v-for="item in maintain_type" :value="item.value" :label="item.label" :key='item.value'>
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row v-if="isAddOrComp==2">
					<el-col :span="15" :offset='1'>
						<el-form-item label="维保人员:" :label-width="formLabelWidth">
							<el-select size="mini" multiple v-model="form.mainPeoson" placeholder="请选择人员" clearable>
								<el-option v-for="item in personArr" :value="item.person_id" :label="item.person_name" :key='item.person_id'>
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="15" :offset='1'>
						<el-form-item label="维保日期:" :label-width="formLabelWidth" prop="mainDate">
							<el-date-picker size="mini" v-model="form.mainDate" type="date" placeholder="请选择维保日期" format="yyyy-MM-dd"
							 value-format="yyyy-MM-dd" clearable>
							</el-date-picker>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="15" :offset='1'>
						<el-form-item label="备注:" :label-width="formLabelWidth">
							<el-input size="mini" v-model="form.des" autocomplete="off" clearable></el-input>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="close">取 消</el-button>
				<el-button type="primary" @click="submit('form')" v-loading='ensureBtn'>确 定</el-button>
			</div>
		</el-dialog>
	</div>
</template>

<script>
	import {
		axiosPost,
		axiosGet,
		loadFn,
		axiosChange,
		AllLoading
	} from "@/common.js"
	import {
		userUnit,
		choseLift,
		mainDate,
		mainType,
	} from "./rule.js"
	export default {
		props: ['addAndCompileShow', 'isAddOrComp', 'rowId'],
		mounted() {
			if (this.title == '添加保养工单') {
				this.isLoading = false
			}
		},
		data() {
			return {
				insetCode:'',
				formLabelWidth: '90px',
				form: {
					userUnit: '',
					choseLift: [],
					mainDate: '',
					des: '',
					mainType: '',
					mainPeoson: [],
				},
				dialogFormVisible: true,
				ensureBtn: false,
				rules: {
					userUnit,
					choseLift,
					mainDate,
					mainType,
				},
				userUnitArr: [],
				liftNewArr: [],
				oldLiftArr: [],
				maintain_type: [{
						value: 90,
						label: "国标-液压电梯-年度"
					},
					{
						value: 100,
						label: "国标-液压电梯-季度"
					},
					{
						value: 110,
						label: "国标-液压电梯-半月"
					},
					{
						value: 120,
						label: "国标-液压电梯-半年"
					},
					{
						value: 130,
						label: "国标-杂物电梯-年度"
					},
					{
						value: 140,
						label: "国标-杂物电梯-季度"
					},
					{
						value: 150,
						label: "国标-杂物电梯-半月"
					},
					{
						value: 160,
						label: "国标-杂物电梯-半年"
					},
					{
						value: 170,
						label: "国标-曳引电梯-年度"
					},
					{
						value: 180,
						label: "国标-曳引电梯-季度"
					},
					{
						value: 190,
						label: "国标-曳引电梯-半月"
					},
					{
						value: 200,
						label: "国标-曳引电梯-半年"
					},
					{
						value: 210,
						label: "国标-自动扶梯-年度"
					},
					{
						value: 220,
						label: "国标-自动扶梯-季度"
					},
					{
						value: 230,
						label: "国标-自动扶梯-半月"
					},
					{
						value: 240,
						label: "国标-自动扶梯-半年"
					},
				],
				loading: false,
				personArr: [],
				workerArr: [],
				isLoading: true
			}
		},
		computed: {
			title() {
				if (this.isAddOrComp == 1) {
					return '添加保养工单'
				} else {
					this.getCompileList()
					return '编辑保养工单'
				}
			},
			liftMess() {
				if (!!this.form.userUnit) {
					return '请选择维保电梯'
				} else {
					return '请先选择使用单位'
				}
			},
			disableLift() {
				if (!!this.form.userUnit) {
					return false
				} else {
					return true
				}
			},
		},
		methods: {
			//电梯选择自定义过滤
			dataFilter(val) {
				console.log(this.liftNewArr)
				if (val) {
					this.liftNewArr = []
					this.liftNewArr = this.oldLiftArr.filter((item) => {
						if (item.register_code.indexOf(val) != -1 || item.internal_no.indexOf(val) != -1) {
							return item
						}
					})
				} else {
					this.liftNewArr = this.oldLiftArr
				}
			},
			//获取使用单位
			getUserUnit() {
				let params = {
					company_type: 300,
					page_size_count: 30
				}
				axiosGet('/user/company/all', params, (res) => {
					if (res.code == 0) {
						this.userUnitArr = res.detail.results
					} else {
						this.$message.error(res.detail.result)
					}
				})
			},
			//使用单位发生变化
			selectChange() {
				this.form.choseLift = []
				if (!!this.form.userUnit) {
					let id = this.form.userUnit
					let arr = []
					this.userUnitArr.find((item) => {
						if (id == item.id) {
							arr = item.elevator_info
						}
					})
					this.liftNewArr = arr
					this.oldLiftArr = arr
				}
			},
			//使用单位开启搜索
			findUserUnit(query) {
				console.log(query)
				let params = {
					company_type: 300,
					key_words: query
				}
				axiosGet('/user/company/all', params, (res) => {
					if (res.code == 0) {
						this.userUnitArr = res.detail.results
					} else {
						this.$message.error(res.detail.result)
					}
				})
			},
			//获取编辑工单数据
			getCompileList() {
				this.loading = true
				let rowId = this.rowId ? this.rowId : ''
				let url = '/maintain/task/' + rowId + '/'
				axiosGet(url, {}, (res) => {
					this.isLoading = false
					this.loading = false
					if (res.code == 0) {
						this.form.mainType = res.detail.maintain_type
						this.personArr = res.detail.elevator_worker
						this.form.mainPeoson = res.detail.worker
						this.userUnitArr = [{
							id: res.detail.property_company_id,
							label: res.detail.property_company_name
						}]
						this.form.userUnit = res.detail.property_company_id
						this.liftNewArr = [{
							elevator_id: res.detail.elevator,
							register_code: res.detail.register_code
						}]
						this.form.choseLift.push(res.detail.elevator)
						this.form.mainDate = res.detail.day
						this.form.des = res.detail.desc
					} else {
						this.$message.error(res.detail.result)
					}
				})
			},
			//添加保养工单
			addUserPlan(put) {
				let arr = []
				let rowId = this.rowId ? this.rowId : ''
				let method = ''
				let url = ''
				if (put) {
					method = 'put'
					url = '/maintain/task/' + rowId + '/'
					arr[0] = this.form.choseLift[0]
					arr[1] = this.form.mainPeoson
					arr[2] = this.form.mainType
					console.log(arr)
				} else {
					method = 'post'
					url = '/maintain/task/'
					let listArr = this.liftNewArr.filter((item) => {
						for (let i = 0; i < this.form.choseLift.length; i++) {
							if (item.elevator_id === this.form.choseLift[i]) {
								return item
							}
						}
					})
					listArr.map((item) => {
						var newArr = []
						var newPersonArr = []
						newArr[0] = item.elevator_id
						item.maintain_person.map((item1) => {
							newPersonArr.push(item1.person_id)
						})
						newArr[1] = newPersonArr
						newArr[2] = item.maintain_type.maintain_type
						arr.push(newArr)
					})
				}

				let data = {
					day: this.form.mainDate,
					desc: this.form.des,
					elevator_info: arr,
				}
				console.log(method, url, data)
				axiosChange(url, method, data, (res) => {
					console.log(res)
					this.ensureBtn = false
					if (res.code == 0) {
						this.close(1)
						this.$message({
							type: 'success',
							message: '操作成功'
						})
					} else {
						this.$message.error(res.detail.result)
					}
				})
			},
			//提交
			submit(ruleForm) {
				this.$refs[ruleForm].validate((valid) => {
					if (valid) {
						this.ensureBtn = true
						if (this.isAddOrComp == 1) {
							this.addUserPlan()
						} else {
							this.addUserPlan(1)
						}
					} else {
						console.log('error submit!!');
						return false;
					}
				});
			},
			//关闭
			close(value) {
				let newValue = 2
				if (value) {
					newValue = value
				}
				this.$emit('detailMaskShow', newValue)
			}
		}
	}
</script>
<style scoped lang="less">
</style>
